<!--
 * @Author: your name
 * @Date: 2021-04-19 14:35:42
 * @LastEditTime: 2021-04-19 14:37:16
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \vue-xmll\src\pages\Personal\Myorder\index.vue
-->
<template>
  <div>
    <!-- 右边内容展示区 -->
    <div class="container-right">
      <div class="title">
        <h2>我的订单</h2>
      </div>
      <!-- 订单 -->
      <div class="container-order">
        <div>
          <span>2021-04-16 17:55</span>
          <span class="order-id">订单号:
            <a href="javascript:;">161856693290858</a>
          </span>
        </div>
        <div class="right">
          <span>单价</span>
          <span>数量</span>
          <span>商品操作</span>
        </div>
        <div class="last">
          <span>实付金额</span>
          <span>
            <a href="javscript:;">查看详情 ></a>
          </span>
        </div>
      </div>
      <div class="shopCart">
        <div class="cart-1">
          <div class="cart-1-1">
            <div class="image-box">
              <a href="javascript:;">
                <img src="https://ooo.0o0.ooo/2018/07/13/5b48ac7766d98.png">
              </a>
            </div>
            <div class="ellipsis">
              <a href="javascript:;">支付测试商品 IPhone X 全面屏 全面绽放</a>
            </div>
            <span>￥ 1 ：00</span>
            <span>1</span>
            <span><button>删除</button></span>
            <div class="prod-operation">
              <div>￥1</div>
              <div>交易成功</div>
            </div>
          </div>
        </div>
      </div>
      <!-- 分页器 -->
      <el-pagination :current-page="10"
                     style="text-align:right"
                     :page-sizes="[10, 20, 50]"
                     :page-size="3"
                     layout="total, sizes, prev, pager, next, jumper"
                     :total="30">
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Myorder',
}
</script>

<style lang="less" scoped>
</style>
